<include file="public@header"/>
</head>
<body>
<div class="wrap">
    <ul class="nav nav-tabs">
        <li><a href="{:url('bill/index',array('id'=>$id))}">流水账目</a></li>
        <li class="active"><a href="">详情</a></li>
    </ul>
    <form method="post" class="form-horizontal js-ajax-form margin-top-20" action="{:url('doedit')}" enctype="multipart/form-data">

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>支付方式
            </label>
            <div class="col-md-6 col-sm-10">
                <select name="pay" class="form-control">
                    <if condition="$res['pay'] eq 1">
                        <option value="1">微信</option>
                        <elseif condition="$res['pay'] eq 2"/>
                        <option value="2">支付宝</option>
                        <elseif condition="$res['pay'] eq 3"/>
                        <option value="3">银行卡</option>
                        <elseif condition="$res['pay'] eq 4"/>
                        <option value="4">淘宝</option>
                        <elseif condition="$res['pay'] eq 5"/>
                        <option value="5">现金</option>
                        <elseif condition="$res['pay'] eq 6"/>
                        <option value="6">签字</option>
                    </if>
                    <option value="1">微信</option>
                    <option value="2">支付宝</option>
                    <option value="3">银行卡</option>
                    <option value="4">淘宝</option>
                    <option value="5">现金</option>
                    <option value="6">签字</option>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>申请人
            </label>
            <div class="col-md-6 col-sm-10">
                <select name="applicant" id="nameSelect" class="form-control">
                    <option value="">请选择</option>
                    <volist name="leader" id="vv">
                        <option value="{$vv.id}" <if condition="$vv.id eq $res['applicant']">selected</if>>{$vv.name}</option>
                    </volist>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>工种
            </label>
            <div class="col-md-6 col-sm-10">
                <input name="type" id="typeSelect" class="form-control" value="{$res['type']}" />
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>供应商
            </label>
            <div class="col-md-6 col-sm-10">
                <select name="supplier" class="form-control">
                    <option value="{$res.supplier}">{$res.lname}</option>
                    <foreach name="supplier" item="sup">
                        <option value="{$sup.id}">{$sup.attrName}</option>
                    </foreach>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>事件简介
            </label>
            <div class="col-md-6 col-sm-10">
                <textarea name="desc" cols="25" rows="5" class="form-control">{$res.desc}</textarea>
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>经办人
            </label>
            <div class="col-md-6 col-sm-10">
                <select name="handled" class="form-control">
                    <option value="{$res['handled']}">{$res['handled']}</option>
                    <volist name="staff" id="c">
                        <option value="{$c.name}">{$c.name}</option>
                    </volist>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>单位
            </label>
            <div class="col-md-6 col-sm-10">
                <select name="unit" class="form-control">
                    <option value="{$res.unit}">{$res.unit}</option>
                    <option value="米">米</option>
                    <option value="平方">平方</option>
                    <option value="项">项</option>
                    <option value="扇">扇</option>
                    <option value="樘">樘</option>
                    <option value="组">组</option>
                    <option value="吨">吨</option>
                    <option value="小时">小时</option>
                    <option value="张">张</option>
                    <option value="车">车</option>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>数量
            </label>
            <div class="col-md-6 col-sm-10">
                <input type="number" class="form-control" name="num" value="{$res['num']}">
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>金额
            </label>
            <div class="col-md-6 col-sm-10">
                <input type="text" class="form-control" name="price" value="{$res['price']}">
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>走账
            </label>
            <div class="col-md-6 col-sm-10">
                <select name="payfor" class="form-control">
                    <if condition="$res['payfor'] eq 1">
                        <option value="1">备用金</option>
                        <elseif condition="$res['payfor'] eq 2"/>
                        <option value="2">签字</option>
                        <elseif condition="$res['payfor'] eq 3"/>
                        <option value="3">公司付</option>
                    </if>
                    <option value="1">备用金</option>
                    <option value="2">签字</option>
                    <option value="3">公司付</option>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                <span class="form-required">*</span>时间
            </label>
            <div class="col-md-6 col-sm-10">
                <input type="date" class="form-control" name="insTime" value="{$res.insTime}">
            </div>
        </div>

        <div class="form-group">
            <label for="js-smtpsecure" class="col-sm-2 control-label">
                单据图片
            </label>
            <div class="col-md-6 col-sm-10">
                <input type="file" name="imgs[]" class="form-control" id="imgUpload" multiple accept="image/*" />
                <div id="imgPreviewContainer" class="image-preview-container" style="margin-top: 10px; display: flex; flex-wrap: wrap;"></div>
            </div>
        </div>

        <input type="hidden" name="eid" value="{$id}">
        <input type="hidden" name="id" value="{$res.id}">

        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-primary js-ajax-submit">{:lang('SAVE')}</button>
                <a class="btn btn-default" href="javascript:history.back(-1);">{:lang('BACK')}</a>
            </div>
        </div>
    </form>
</div>
<script src="__STATIC__/js/admin.js"></script>
<script src="__STATIC__/js/image-uploader.js"></script>
<script>
    // 输出姓名与工种的映射
    var nameTypeMap = {};
    <volist name="leader" id="vv">
        nameTypeMap["{$vv.name}"] = "{$vv.type}";
    </volist>

    var nameSelect = document.getElementById('nameSelect');
    var typeSelect = document.getElementById('typeSelect');

    nameSelect.addEventListener('change', function () {
        var name = this.options[this.selectedIndex].text;
        var type = nameTypeMap[name] || '';
        typeSelect.value = type;
    });

    // 页面加载完成后初始化所有功能
    document.addEventListener('DOMContentLoaded', function() {
        // 设置工种
        if (nameSelect.selectedIndex > 0) {
            var name = nameSelect.options[nameSelect.selectedIndex].text;
            var type = nameTypeMap[name] || '';
            typeSelect.value = type;
        }
        
        // 初始化图片上传组件
        var imgUploader = new ImageUploader({
            inputId: 'imgUpload',
            previewContainerId: 'imgPreviewContainer',
            fieldName: 'imgs',
            existingImages: [
                <if condition="!empty($res['imgs']) && is_array($res['imgs'])">
                    <volist name="res['imgs']" id="v">
                        "{$v}",
                    </volist>
                </if>
            ],
            useDataTransfer: true
        });
    });
</script>
</body>
</html>